<!DOCTYPE html>
<html lang="zh">
<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<meta http-equiv="X-UA-Compatible" content="ie=edge">
	<title></title>
	<style type="text/css">
		div{
			width: 200px;
			height: 200px;
			background: red;
		}
	</style>
	<script type="text/javascript">
		
		window.onload = function(){
			var oBtn1 = document.getElementById('show_btn');
			var oBtn2 = document.getElementById('hide_btn');
			var oDiv = document.getElementById('div1');
			var oStrong = document.getElementById('strong');
			
			//有名和匿名函数
			oStrong.onclick = show;
			oBtn1.onclick = show;
			
			function show(){
				oDiv.style.display = 'block'
				oDiv.style.width = '290px'
			}
			oBtn2.onclick = function(){
				oDiv.style.display = 'none'
			}
		}
	</script>
</head>
<body>
	<input id="show_btn" type="button" value="显示" />
	<input id="hide_btn" type="button" value="隐藏" />
	<strong id="strong">我也要让他显示</strong>
	<div id="div1"></div>
</body>
</html>